import React from 'react'
import {Outlet,NavLink} from "react-router-dom"
import { Tabbar } from 'react-vant';
import { FriendsO, HomeO, Search, SettingO } from '@react-vant/icons'
// 二级路由，三级路🈶的得展示通过outlet来展示
function Home() {
  return (
    <div>
        <Outlet></Outlet>
        <Tabbar>
        <Tabbar.Item icon={<HomeO />}>
            <NavLink to="/home/movie">电影</NavLink>
        </Tabbar.Item>
        <Tabbar.Item icon={<Search />}>
            <NavLink to="/home/video">视频</NavLink>
        </Tabbar.Item>
        <Tabbar.Item icon={<FriendsO />}>
             <NavLink to="/home/shortVideo">小视频</NavLink>
        </Tabbar.Item>
        <Tabbar.Item icon={<SettingO />}>
                <NavLink to="/home/show">演出</NavLink>
        </Tabbar.Item>
        <Tabbar.Item icon={<SettingO />}>
                <NavLink to="/my">我的</NavLink>
        </Tabbar.Item>
        
      </Tabbar>

    </div>
  )
}

export default Home